<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>简洁版小米侧边栏</title>
</head>
<style>
    a {
        background-color: rgb(161, 159, 159);
        color: rgb(255, 255, 255);
        text-decoration: none;
        font-size: 14px;
        padding-left: 30px;
        line-height: 40px;
        width: 200px;
        height: 40px;
        display: block;
    }
    
    a:hover {
        background-color: rgb(255, 103, 0);
        color: rgb(255, 255, 255);
    }
    
    a:active {
        background-color: rgba(0, 0, 0, 0.5);
    }
</style>

<body>
    <a href="https://www.mi.com/mi12pro">手机</a>
    <a href="https://www.mi.com/redmik50g">电视</a>
    <a href="https://www.mi.com/buy/detail?product_id=10000321">笔记本 平板</a>
    <a href="https://www.mi.com/buy/detail?product_id=13607">家电</a>
    <a href="https://www.mi.com/xiaomiwatchs1">出行 穿戴</a>
    <a href="https://www.mi.com/cyberdog">智能 路由器</a>
    <a href="https://www.mi.com/search?keyword=%E7%A7%BB%E5%8A%A8%E7%94%B5%E6%BA%90">电源 配件</a>
    <a href="https://www.mi.com/buy/detail?product_id=15025">健康 儿童</a>
    <a href="https://www.mi.com/xiaomibuds3">耳机 音箱</a>
    <a href="https://www.mi.com/search?keyword=%E5%B0%8F%E7%B1%B3%E5%B0%8F%E8%83%8C%E5%8C%85">生活 箱包</a>

</body>

</html>